<template>
	<view>
		<Lines></Lines>
		<view class="form">
			<view class="form-item">
				<view>手机号</view>
				<input class='item-input' type="number" focus="true" v-model="userTel" placeholder="请输入11位手机号"/>
			</view>
			<view class="register" @click="goDown">下一步</view>
			<view class="text">
				<view>继续注册表示您阅读并同意</view>
				<view>《中规中矩个人网(含胖达优品)服务协议》</view>
			</view>
		</view>
	</view>
</template>

<script>
	import $http from '@/common/api/request.js'
	import Lines from '../../components/common/Line.vue'
	export default {
		data() {
			return {
				userTel:'',
			}
		},
		components:{
			Lines
		},
		methods: {
			goDown(){
				const userTel=this.userTel
				if(userTel.length!=11 || userTel.charAt(0)!=1 || userTel.charAt(1)==2 ){
					uni.showToast({
						title:'请输长度为11位的电话号码',
						icon:'none'
					})
				}else{
					
					$http.request({
						url: '/register',
						method:"POST",
						header:{
							'content-type': 'application/x-www-form-urlencoded'
						},
						data:{
							phone:this.userTel
						}
					}).then((res) => {
						if(!res.success){
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
						}else{
							uni.navigateTo({
								url:'../code/code?phone="'+this.userTel+'"'
							})
						}
					}).catch(() => {
						uni.showToast({
							title: '请求失败',
							icon: 'none'
						})
					})
					

				}

			}
		}
	}
</script>

<style scoped>
.form{
	padding-top: 20rpx;
	margin: 0 20rpx;
}
.form-item{
	padding: 20rpx;
	display: flex;
	border-bottom: 2rpx solid #A1A1A1;
}
.item-input{
	padding-left: 20rpx;
}
.register{
	width: 90%;
	padding: 26rpx 30rpx;
	display: flex;
	align-items:center;
	justify-content: center;
	background-color: #00B7FF;
	color: #FFFFFF;
	border-radius: 50rpx;
	margin: 30rpx auto;
}
.text{
	display: flex;
	font-size: 24rpx;
}
.text view:last-child{
	color: #00B7FF;
}
</style>
